
<template>
  <div>
    <h2>风险地区</h2>
    <div class="content">
      <template v-if="high.length>0">
        <div class="title">高风险地区{{high.length}}个</div>
        <ul>
          <li v-for="(item,index) in high" :key="index" style="color: brown;">{{item}}</li>
        </ul>
      </template>
      <template v-if="mid.length>0">
        <div class="title">中风险地区{{mid.length}}个</div>
        <ul>
          <li v-for="(item,index) in mid" :key="index" style="color: orange;">{{item}}</li>
        </ul>
      </template>
    </div>
  </div>
</template>

<script>
import {getCovInfo} from '../../api/base';
export default {
  name: 'index',
  created() {
    getCovInfo().then(res=>{
      let riskarea = res.data.newslist[0].riskarea;
      this.high = riskarea.high;
      this.mid = riskarea.mid;
    }).catch(err=>console.errer('出错'));
  },
  data() {
    return {
      high:[],
      mid:[]
    }
  }
}
</script>

<style scoped>
.title{
  color: rgb(61, 63, 65);
  font-size: .5rem;
}
</style>

